/* pages/task_detl/components/taskOpr/taskOpr.wxss */
.m-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  font-size: 30rpx;
  background: rgba(0, 0, 0, 0.4);

  &.show {
    display: block;
  }

  &.hide {
    display: none;
  }

  >.m-container {
    display: flex;
    flex-direction: column;
    width: 86%;
    max-height: 90%;
    box-sizing: border-box;
    margin: 10% auto 0;
    border-radius: 8rpx;
    background: #fff;

    >.m-header {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 36rpx;
      padding: 32rpx 0 28rpx;
      font-size: 34rpx;
      color: #6f6f6f;


      >.img {
        position: absolute;
        right: -12rpx;
        display: block;
        width: 28rpx;
        padding: 12rpx;
      }
    }

    >.m-main {
      flex: 1;
      // background: pink;
      // padding-top: 16rpx;
      padding: 32rpx 52rpx 72rpx;
      overflow-y: auto;

      >.driver {
        display: flex;
        margin-bottom: 36rpx;

        >.avatar {
          position: relative;   
          z-index: 1;
          width: 5em;
          margin-right: 12rpx;

          &::before {
            content: '';
            position: absolute;
            z-index: -1;
            width: 4em;
            height: 4em;
            border-radius: 50%;
            background: rgba(0, 162, 255, 0.3);
          }

          >.img {
            display: block;
            width: 3.5em;
            height: 3.5em;
            margin: 0.25em;
            border-radius: 50%;
          }

        }

        >.info {
          display: flex;
          flex-direction: column;
          justify-content: center;
          padding: 0 16rpx;

          >.text {
            margin-bottom: 8rpx;

            &:last-child {
              margin-bottom: 0;
            }
          }
        }
      }

      >.item {
        display: flex;
        margin-bottom: 36rpx;
        
        >.label {
          min-width: 5em;
          width: 5em;
          margin-right: 12rpx;
          color: #6f6f6f;
        }

        >.val {
          padding: 0 16rpx;
        }

        &.item_upload {
          flex-wrap: wrap;

          >.label {
            width: 100%;
            margin-bottom: 24rpx;
          }

          >.val {
            display: flex;
            padding: 0;
            
            >.upload_wrap {
              position: relative;
              display: flex;
              flex-direction: column;
              justify-content: center;
              align-items: center;
              width: 160rpx;
              height: 160rpx;
              margin-right: 28rpx;
              border: 2rpx solid #ddd;
              border-radius: 8rpx;
              font-size: 28rpx;
              color: #999;
              background: #f2f2f2;
              overflow: hidden;

              >.icon {
                margin-bottom: 16rpx;
                font-size: 48rpx;
                color: #999;
              }

              >.img {
                position: absolute;
                top: 0;
                left: 0;
                display: block;
                width: 100%;
                height: 100%;
                background: #fff;
              }

              >.del {
                position: absolute;
                top: 0;
                right: 0;
                display: flex;
                justify-content: center;
                align-items: center;
                width: 50rpx;
                height: 50rpx;
                color: #fff;
                background: rgba(0, 0, 0, 0.5);
              }
            }
          }
        }
      }

      >.item_wrap {
        display: flex;
        align-items: center;
        margin-bottom: 36rpx;
        
        >.label {
          min-width: 5em;
          width: 5em;
          margin-right: 12rpx;
          color: #6f6f6f;
        }

        >.ipt_wrap {
          position: relative;
          flex: 1;
          display: flex;
          align-items: center;
          padding: 8rpx 16rpx;
          border-bottom: 2rpx solid #ccc;

          >.ipt {
            flex: 1;
          }
          >.img {
            width: 16rpx;
          }
        }
      }
    }

    >.m-footer {
      padding: 16rpx 36rpx 40rpx;

      >.btn_dflt {
        height: 76rpx;
        border-radius: 8rpx;
      }
    }
  }

  >.aaa {
    width: 100%;
    height: 100%;
  }
}